<script>
	import {cards} from './store'; // 引入 cards
	import Card from "./Card.svelte";
	import AddCard from "./AddCard.svelte";
</script>

<div id="app">
	{#each $cards as card, i}
    <Card {...card} index={i}/>
  {/each}
  <AddCard/>
</div>
<style>
	#app {
		/* text-align: center; */
		padding: 1em;
		max-width: 240px;
		margin: 0 auto;
	}

	@media (min-width: 640px) {
		#app {
			max-width: none;
		}
	}
</style>